<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
<script>
 window.onload=function() {
 	var oUl=document.getElementById('lis');
 	var aLi=oUl.getElementsByTagName('li');
 	// fn1(aLi[0]);
 	// fn1(aLi[1]);
 	for(var i=0;i<aLi.length;i++){
 		fn1(aLi[i]);
 	}
  var s=null;
  var w=null;
	function fn1(oLi){
		var aBtn=oLi.getElementsByTagName("input");
		var oStr=oLi.getElementsByTagName("strong")[0];
		var oEtn=oLi.getElementsByTagName("em")[0];
		var oSpan=oLi.getElementsByTagName("span")[0];
		var oSp=oLi.getElementsByTagName("b")[0];
		var n1=Number(oStr.innerHTML);
		var n2=parseFloat(oEtn.innerHTML);
		aBtn[0].onclick=function(){
			// n1+=1;
			n1--;
			if(n1<0){n1=0;}
			oStr.innerHTML=n1;
			oSpan.innerHTML=n1*n2+"元";
		}
		aBtn[1].onclick=function(){
			// n1+=1;
			n1++;
			if(n1>10){n1=10;}
			oStr.innerHTML=n1;
			oSpan.innerHTML=n1*n2+"元";
		}
    }
 }
</script>
</head>
<body>
<ul id=lis>
  <li>
   <input type="button" value="-" />
   <strong>0</strong>
   <input type="button" value="+" /> 
    单价：<em>12.5元</em>  小价：<span>0元</span> 
  </li>
  <li>
   <input type="button" value="-" />
   <strong>0</strong>
   <input type="button" value="+" /> 
    单价：<em>17.5元</em>小价：<span>0元</span> 
  </li>
  <li>
   <input type="button" value="-" />
   <strong>0</strong>
   <input type="button" value="+" /> 
    单价：<em>16.5元</em>小价：<span>0元</span> 
  </li>
  <li>
   <input type="button" value="-" />
   <strong>0</strong>
   <input type="button" value="+" /> 
    单价：<em>14.5元</em>小价：<span>0元</span> 
  </li>
  <li>
   <input type="button" value="-" />
   <strong>0</strong>
   <input type="button" value="+" /> 
    单价：<em>11.5元</em>小价：<span>0元</span> 
  </li>
</ul>
<p>
总计为：<strong>0件</strong>，共花费了：<span>0元</span>
其中最贵的商品单价是：<e>0元</e>
</p>
</body>
</html>